<div class="banks-c">
  <nz-header class="account-header">
      <button nz-button nzType="primary" (click)="showModal()">{{ 'myacy-banks.add-bank-btm' | translate }}</button>
  </nz-header>
  
  <nz-content>
    <div class="account-table">
      <app-wallet-table [data]="_data" [titleData]='_config' [page]='_page' (tabelEvent)='onClick($event)'></app-wallet-table>
    </div>
  </nz-content>
</div>


<nz-modal nzWidth="466px" class="banks-from" [(nzVisible)]="isVisible" [nzTitle]="modalTitle" [nzContent]="modalContent" [nzFooter]="null" [nzClosable]='false' >
    <ng-template #modalTitle >
        <h4>{{_altTitle}}</h4>
    </ng-template>

    <ng-template #modalContent>
        <form nz-form [formGroup]="validateForm" >

          <nz-form-item>
            <nz-form-label [nzSpan]="24" nzRequired>户主</nz-form-label>
            <nz-form-control  [nzSpan]="24" nzHasFeedback >
              <input nz-input formControlName="bankAccountName" placeholder="请输入户主"  nzRequired maxlength="30">
              <nz-form-explain *ngIf="validateForm.get('bankAccountName').dirty&&validateForm.get('bankAccountName').errors">请输入户主名</nz-form-explain>
            </nz-form-control>
          </nz-form-item>
          
          <nz-form-item>
            <nz-form-label [nzSpan]="24" nzRequired >收款银行</nz-form-label>
            <nz-form-control  [nzSpan]="24" nzHasFeedback >
              <input nz-input formControlName="bankName" placeholder="请输入收款银行名称"  nzRequired maxlength="100">
              <nz-form-explain *ngIf="validateForm.get('bankName').dirty&&validateForm.get('bankName').errors">请输入收款银行名称</nz-form-explain>
            </nz-form-control>
          </nz-form-item>
         
          <nz-form-item>
            <nz-form-label [nzSpan]="24" >支行</nz-form-label>
            <nz-form-control  [nzSpan]="24"  >
              <input nz-input formControlName="bankSubBranch" placeholder="请输入支行信息"  maxlength="100" >
              <nz-form-explain *ngIf="validateForm.get('bankSubBranch').dirty&&validateForm.get('bankSubBranch').errors">请输入支行信息</nz-form-explain>
            </nz-form-control>
          </nz-form-item>
         
          <nz-form-item>
            <nz-form-label [nzSpan]="24" nzRequired>收款银行账号</nz-form-label>
            <nz-form-control  [nzSpan]="24" nzHasFeedback >
              <input nz-input formControlName="bankAccountNum" placeholder="请输入收款银行账号"  nzRequired maxlength="100">
              <nz-form-explain *ngIf="validateForm.get('bankAccountNum').dirty&&validateForm.get('bankAccountNum').errors">请输入收款银行账号</nz-form-explain>
            </nz-form-control>
          </nz-form-item>

          <nz-form-item nz-row >
              <nz-form-control [nzSpan]="14" >
                <label nz-checkbox formControlName="isDefault">
                  <span>设为默认收款银行</span>
                </label>
              </nz-form-control>
            </nz-form-item>

        </form>

        <div  class="from-footer">
          <button nz-button nzType="primary" [disabled]="!validateForm.valid"  (click)="handleOk(validateForm.value)">确认</button>
          <button nz-button nzType="default" (click)="handleCancel()" [nzLoading]="isConfirmLoading">取消</button>
        </div>
    </ng-template>

  </nz-modal>